<?php

use yii\helpers\Url;
use yii\helpers\Html;
use website\helpers\Render;
use common\models\UserCoupon;

$this->title = '我的优惠劵';
?>
<style>
    #info-table {padding-top:10px;}
    #info-table .coupon-detail {float:left;width:50%;}
    #info-table .coupon-detail .panel {margin:20px 60px;padding:20px;height:90px;border:1px solid #666;box-shadow:3px 3px 5px rgba(0,0,0,.3);}
    #info-table .coupon-detail .amount,
    #info-table .coupon-detail .describe {float:left;width:174px;}
    #info-table .coupon-detail .amount {line-height:90px;text-align:center;font-size:42px;font-weight:700;}
    #info-table .coupon-detail .describe p {line-height:30px;}
    #info-table .coupon-detail .describe .use-button {display:block;width:120px;text-align:center;color:#fff;background-color:#333;}
    #info-table .coupon-detail.disabled .panel {background-color:#aaa;border-color:#999;color:#666;}
    #info-table .coupon-detail.disabled .panel .use-button {background-color:#666;}
</style>

<div class="contenter">
    <?= $this->render('/user/navigator', ['active' => 'coupon-list']) ?>

    <div id="user-contenter">
        <div class="box-shadow pb-20px" id="sub-contenter">
            <div class="data-title"><span class="h3"><?= $this->title ?></span></div>
            <div class="clear" id="info-table">
                <div class="coupon-detail"><i class="icon-search"></i> 数据加载中，请稍后.</div>
            </div>
            <div class="flyer-page mt right" id="info-page"><div class="html mr-10px"></div></div>
        </div>
    </div>
</div>

<script src="<?= Render::static('art-template/template.js') ?>"></script>
<script src="<?= Render::static('flyer/checker.class.js') ?>"></script>
<script src="<?= Render::static('flyer/tabler.class.js') ?>"></script>
<script src="<?= Render::static('flyer/tableHandler.class.js') ?>"></script>
<script>
    $(document).ready(function() {
        // 初始化表格异步加载事件
        (new tabler).init({
            // 请求地址
            url: '<?= Url::to('@web/employer/coupon-list') ?>',
            // 数据渲染配置
            table: '#info-table', page: '#info-page', template: 'info-template', search: '#info-search', readyCall: true,
            // param => tabler
            afterPost: function(param) {
            
            }
        });
    });
</script>
<script id="info-template" type="text/html">
    {{if infos != undefined && infos.length}}
    {{each infos as info key}}
    <div class="coupon-detail boxing{{if info.status == '<?= UserCoupon::StatusUsed ?>'}} disabled{{/if}}" id="tr-{{info.id}}" data-id="{{info.id}}">
        <div class="panel clear">
            <div class="amount">{{info.deduct}}</div>
            <div class="describe">
                <p>{{info.coupon.title}}</p>
                <p>
                    {{if info.status != '<?= UserCoupon::StatusUsed ?>'}}
                    <a class="use-button" href="<?= Url::to('@web/search/designer') ?>">点击使用 <i class="icon-play"></i></a></p>
                    {{else}}
                    <a class="use-button">已使用 <i class="icon-stop"></i></a>
                    {{/if}}
                <p>{{info.begin_at | dateShow: 'day'}} / {{info.finish_at | dateShow: 'day'}}</p>
            </div>
        </div>
    </div>
    {{/each}}
    {{else}}
    <div class="pd-10px"><i class="icon-ban-circle"></i> 您还没有任何简历收藏信息！</div>
    {{/if}}
</script>